/* =========================================================
   GLOBÁLNÍ NASTAVENÍ
========================================================= */

/* Barvy:
   tmavě modrá: #122038
   béžová: #C4BFB0 / #c4bfb1
*/

/* =========================================================
   HEADER
========================================================= */

header {
  background-color: #122038 !important;
}

.content-inner header {
  background-color: transparent !important;
}

/* SVG na dropdown menu */
.menu-helper:after {
  background-image: url("https://www.xore.cc/user/documents/upload/material-symbols_menu-rounded.svg") !important;
  background-size: 30px;
}

/* Navigace */
#navigation ul.menu-level-1 > li > a,
#navigation ul.menu-level-1 > li > a.active {
  color: white !important;
}

#navigation ul.menu-level-1 > li > a:hover {
  color: #c4bfb0 !important;
}

#navigation ul.menu-level-1 > li > a:after {
  background: #c4bfb0 !important;
}

#navigation ul.menu-level-2 > li > a,
#navigation ul.menu-level-2 > li > a.active {
  color: #122038 !important;
}

.menu-level-2 {
  box-shadow: 0 10px 20px 0 rgba(8, 92, 103, 0.05);
}

#nav-manufacturers {
  display: none !important;
}

/* Ikony v headeru */
#header .search-form .search-toggle,
#header .top-nav-button::before,
#header .toggle-window::before {
  filter: invert(1) !important;
}

#header .navigation-buttons .btn.cart-count i {
  background-color: #122038 !important;
  border: 1px solid #fff !important;
}

/* =========================================================
   TYPOGRAFIE / TEXTY
========================================================= */

.extended-banner-title,
.extended-banner-text,
.extended-banner-link,
.extended-banner-link:hover,
.benefitBanner .benefitBanner__picture,
.benefitBanner .benefitBanner__title,
.benefitBanner .benefitBanner__data,
.h4,
.btn-icon,
#header .navigation-buttons .btn.cart-count,
.products-block.products .product .p .name,
.products-block.products .product .prices .price-final strong,
.products-block.products .product button,
.hp-categories-posts .news-item .text a,
.text,
#footer .custom-footer h4,
#footer .custom-footer li a,
#footer strong,
#footer ul li,
#footer ul li span,
#footer ul li span a,
.footer-socials ul li,
main .filters-wrapper .unveil-button:after,
.category-header fieldset input[type="radio"]:checked + label,
.category-header label,
.category-header > div,
.category-title,
.external-fonts-loaded body,
body,
body.blank-mode,
.p-detail .price-line .price-final,
.product-top .p-detail-info .p-short-description,
.product-top .p-detail-info .p-short-description a,
h1,
.p-detail .p-code,
.product-top .social-buttons-wrapper a span,
.type-detail .shp-tabs-wrapper .shp-tabs-row .shp-tabs-holder li.active a,
.password-helper a {
  color: #122038 !important;
}

.hp-categories-posts .news-item .image a,
.hp-categories-posts .news-item .image a::before {
  color: #c4bfb0 !important;
}

.hp-categories .hp-categories-posts .news-wrapper .news-item:hover a:before {
  border-bottom-color: #c4bfb0 !important;
}

h1 {
  padding-top: 24px !important;
}

h1.site-name {
  padding-top: 0 !important;
}

/* =========================================================
   HERO
========================================================= */

span.extended-banner-texts.empty {
  display: flex !important;
}

.nadpis-hero-sekce {
  font-size: 100px !important;
  font-weight: 500 !important;
  color: white !important;
}

/* skrytí facebooku v banneru */
.footer-socials {
  display: none;
}

/* =========================================================
   TLAČÍTKA
========================================================= */

.search-form .btn,
.product-top .add-to-cart button,
.cart-widget-button a,
.btn-login,
.login-wrapper .btn,
.cpost-delivery-point-submit .btn,
.form-group .btn,
.na-dotaz .btn {
  font-family: "Mulish" !important;
  font-weight: 500 !important;
  font-size: 16px !important;
  color: #ffffff !important;
  background-color: #122038 !important;
}

.search-form .btn:hover,
.product-top .add-to-cart button:hover,
.cart-widget-button a:hover,
.btn-login:hover,
.login-wrapper .btn:hover,
.next-step .btn:hover,
.cpost-delivery-point-submit .btn:hover,
.form-group .btn:hover,
.na-dotaz .btn:hover {
  color: #122038 !important;
  background-color: #c4bfb0 !important;
}

.login-wrapper .btn-login {
  width: 100% !important;
}

/* =========================================================
   FOOTER
========================================================= */

.custom-footer {
  display: flex;
  flex-wrap: nowrap !important;
  justify-content: space-between;
}

.custom-footer > div {
  width: fit-content !important;
}

.custom-footer__search .extended {
  width: 400px !important;
}

.footer-bottom .podpis {
  display: none !important;
}

/* =========================================================
   KONTAKTY
========================================================= */

.kontakty {
  display: flex;
  flex-direction: row !important;
  margin-top: 64px !important;
}

.kontakty .udaje {
  width: 48%;
  margin-right: 4%;
}

.kontakty .formular {
  width: 48%;
}

.kontakt-nadpis {
  font-weight: 700 !important;
  font-size: 1.2em !important;
  padding-bottom: 0;
  letter-spacing: 0.4px;
  margin-top: 20px;
  position: relative;
  margin-bottom: 16px;
  text-transform: uppercase;
  padding-top: 40px !important;
}

.udaje .jmeno {
  padding-top: 0 !important;
  font-size: 1.8em !important;
  margin-bottom: 24px !important;
}

.formular p {
  font-weight: 700 !important;
  font-size: 1.2em !important;
  padding-bottom: 0;
  position: relative;
  margin-bottom: 16px;
  margin-top: 0 !important;
}

.formular p:nth-child(1) {
  display: none;
}

.formular .form-control {
  width: 100%;
  max-width: 100% !important;
}

/* =========================================================
   RESPONSIVITA
========================================================= */

@media screen and (max-width: 980px) {
  .kontakty {
    flex-direction: column !important;
  }

  .kontakty .udaje {
    width: 100% !important;
    margin-right: 0 !important;
  }

  .kontakty .formular {
    width: 100%;
    padding-top: 72px !important;
  }

  .kontakt-nadpis {
    padding-top: 24px !important;
  }
}

@media screen and (max-width: 767px) {
  .container.navigation-wrapper {
    background-color: #122038 !important;
  }
}

@media only screen and (min-width: 500px) {
  .submit-wrapper .btn-login {
    width: 400px !important;
  }
}

@media only screen and (max-width: 499px) {
  .submit-wrapper .btn-login {
    width: 100% !important;
  }
}